﻿@model HQPad.Models.Item

@{
    ViewBag.Title = "Edit Item";
    Layout = "~/Views/Shared/_ModalLayout.cshtml";
    List<HQPad.Models.EquipmentUseType> useTypes = (List<HQPad.Models.EquipmentUseType>)ViewBag.UseTypes;
}

<script src="@Url.Content("~/Scripts/jquery-ui-1.10.3.custom.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/global.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/item.js")" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function () {
        // set up the use changed event handler.
        $('#itemUseType').change(function () {
            var $this = $(this);

            var options = $this.find('option:selected');

            if (options && options.length > 0)
                onUseChanged($(options[0]).attr('value'));
        });

        // Set default use type.
        var options = $('#itemUseType option:selected');

        if (options && options.length > 0)
            onUseChanged($(options[0]).attr('value'));

        $('.edit-armour').item({
            updateItemUrl: '@Url.Action("UpdateItem", new { id = Model != null ? (int?)Model.Id : null })',    // service url of update armour ajax call.
            updateItemCallback: function () {
                parent.closeModalAndRefresh();
            }
        });
    });

    // The use change event handler function.
    function onUseChanged(useType) {
        switch (useType)
        {
            case 'OnceEver':
            case 'Unlimited':
            case 'AlwaysOn': {
                $('.frequency').hide();
                $('.charges').hide();
                break;
            }
            case 'Charged': {
                $('.frequency').hide();
                $('.charges').fadeIn(300);
                break;
            }
            case 'Recharges': {
                $('.charges').fadeIn(300);
                $('.frequency').fadeIn(300);
                break;
            }
            default: {
                break;
            }
        }
    }
</script>

<h1>Item</h1>

<div class="message-box"></div>

<section class="modal-content">
    <div class="edit-item form modal-form">
        @using (Html.BeginForm("EditItem", "Character", FormMethod.Post, new { @name = "editItemForm", @id = "editItemForm" }))
        {
            <input type="hidden" id="itemId" name="itemId" value="@Html.Raw(Model != null ? Model.Id.ToString() : "")" />  
            <input type="hidden" id="itemType" name="itemType" value="@Html.Raw(Enum.GetName(typeof(HQPad.Helpers.ItemType), HQPad.Helpers.ItemType.Item))" />  
            
            <div class="field-item">
                <div class="label"><label for="itemName">Name:</label></div>
                @Html.TextBoxFor(m => m.ItemName, new { @class = "textbox textbox-wide", id = "itemName" })
            </div>
            <div class="field-item">
                <div class="label"><label for="hqId">HQ ID:</label></div>
                @Html.TextBoxFor(m => m.HQId, new { @class = "textbox textbox-narrow", id = "itemHQID" })
            </div>
            <div class="field-item">
                <div class="label"><label for="itemDescription">Description:</label></div>
                @Html.TextAreaFor(m => m.Description, new { @class = "textbox textbox-wide", id = "itemDescription" })
            </div>
            
            <hr />
            
            <h2>Use</h2>
            
            <div class="field-item">
                <div class="label"><label for="itemUseType">Use type:</label></div>
                @Html.DropDownListFor(m => m.Use, new SelectList(useTypes, "Type", "Description"), new { id = "itemUseType" })
            </div>

            <div class="field-item charges">
                <div class="label"><label for="itemCharges">Charges:</label></div>
                @Html.TextBoxFor(m => m.Charges, new { id = "itemCharges" })
            </div>
            
            <div class="field-item frequency">
                <div class="label"><label for="itemFrequency">Recharge period:</label></div>
                @Html.TextBoxFor(m => m.Frequency, new { id = "itemFrequency" })
            </div>

            
            <hr />
            
            <h2>Icon</h2>
            <p>Select a custom icon for your item.</p>
            
            @Html.Partial("~/Views/Shared/IconPickList.cshtml", Model != null ? Model.Icon : null);
                        
            <input type="submit" value="Update" />
        }
    </div>
</section>
